import React from "react"
import { Carousel } from 'antd-mobile';

export default class Swiper extends React.PureComponent {
  state = {
    imgHeight: 176,
  }

  render() {
    return (
      <Carousel
        autoplay={false}
        infinite
      >
        {this.props.data.map(val => (
          <a
            key={val}
            href="##"
            style={{ display: 'inline-block', width: '100%', height: this.state.imgHeight }}
          >
            <img
              src={val.image_src}
              alt=""
              style={{ width: '100%', verticalAlign: 'top' }}
              onLoad={() => {
                // fire window resize event to change height
                window.dispatchEvent(new Event('resize'));
                this.setState({ imgHeight: 'auto' });
              }}
            />
          </a>
        ))}
      </Carousel>

    );
  }
}